﻿<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:Odyssey_Controls="clr-namespace:Odyssey.Controls;assembly=Odyssey" 
	xmlns:ShoppingList_Converters="clr-namespace:ShoppingList.Converters" 
	xmlns:Odyssey_Effects="clr-namespace:Odyssey.Effects;assembly=Odyssey"
	 x:Class="ShoppingList.Controls.ShoppingListProductsControl"
    mc:Ignorable="d"
    d:DesignHeight="480" d:DesignWidth="480">
    
	<UserControl.Resources>
		<DataTemplate x:Key="menuItemTemplate">
			<Odyssey_Controls:ContextMenu>
				<Odyssey_Controls:ContextMenuItem Content="Modificar" Command="{Binding UpdateProductCommand}" InvokeOnMenuClosed="True"/>
				<Odyssey_Controls:ContextMenuItem Content="Eliminar" Command="{Binding DeleteCommand}" IsEnabled="False"  />
			</Odyssey_Controls:ContextMenu>
		</DataTemplate>
		<ShoppingList_Converters:StringToImageConverter x:Key="StringToImageConverter"/>
	</UserControl.Resources>
	<UserControl.FontFamily>
		<StaticResource ResourceKey="PhoneFontFamilyNormal"/>
	</UserControl.FontFamily>
	<UserControl.FontSize>
		<StaticResource ResourceKey="PhoneFontSizeNormal"/>
	</UserControl.FontSize>
	<UserControl.Foreground>
		<StaticResource ResourceKey="PhoneForegroundBrush"/>
	</UserControl.Foreground>
    
    <Grid x:Name="LayoutRoot">
    	<Odyssey_Controls:OdcListBox x:Name="listboxproducts" ItemsSource="{Binding Products, Mode=TwoWay}">
    		<Odyssey_Controls:OdcListBox.HeaderTemplate>
    			<DataTemplate>
    				<Border Background="{StaticResource PhoneAccentBrush}" Width="72" Height="72" VerticalAlignment="Center" Margin="8,4" HorizontalAlignment="Left">
    					<TextBlock Text="{Binding Title}" VerticalAlignment="Center" FontSize="32" Margin="5,0" Foreground="White"/>
    				</Border>
    			</DataTemplate>
    		</Odyssey_Controls:OdcListBox.HeaderTemplate>
				
    		<Odyssey_Controls:OdcListBox.ItemContainerStyle>
    			<Style TargetType="Odyssey_Controls:OdcListBoxItem">
    				<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    				<Setter Property="Template">
    					<Setter.Value>
    						<ControlTemplate TargetType="Odyssey_Controls:OdcListBoxItem">
    							<Border Odyssey_Controls:ContextMenu.ContextMenuTemplate="{StaticResource menuItemTemplate}"  Odyssey_Controls:ContextMenu.IsOpen="{Binding IsContextMenuOpen, Mode=TwoWay}">
    								<Border.Triggers>
    									<EventTrigger>
    										<BeginStoryboard>
    											<Storyboard>
    												<DoubleAnimation Duration="0" Storyboard.TargetName="grid" Storyboard.TargetProperty="Opacity" To="1"/>
    												<DoubleAnimation Duration="0" Storyboard.TargetName="plane" Storyboard.TargetProperty="GlobalOffsetX" To="0"/>
    											</Storyboard>
    										</BeginStoryboard>
    									</EventTrigger>
    								</Border.Triggers>
    								<Grid x:Name="grid" Opacity="0" Odyssey_Effects:FeatherEffect.IsElement="True" CacheMode="BitmapCache"  Height="80">
    									<Grid.Projection>
    										<PlaneProjection x:Name="plane" GlobalOffsetX="0" />
    									</Grid.Projection>
    									<Odyssey_Controls:CommandButton  BorderThickness="0" Width="80" Height="80" VerticalAlignment="Center"
    										HorizontalAlignment="Left" Margin="0" Padding="0"
    										Command="{Binding OpenContextMenu}" >
    										<Odyssey_Controls:CommandButton.Template>
    											<ControlTemplate>
    												<Rectangle Fill="{StaticResource PhoneChromeBrush}" Width="72" Height="72" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="0,5"/>
    											</ControlTemplate>
    										</Odyssey_Controls:CommandButton.Template>
    									</Odyssey_Controls:CommandButton>
                                            <!--<Rectangle Fill="{StaticResource PhoneChromeBrush}" Width="72" Height="72" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="0,5"/>-->
    									<Grid  HorizontalAlignment="Stretch" >
    										<Grid.ColumnDefinitions>
    											<ColumnDefinition Width="Auto"/>
    											<ColumnDefinition Width="*"/>
    										</Grid.ColumnDefinitions>
    										<TextBlock Grid.Column="1" Text="{Binding CurrentProduct.Name}" FontSize="48" VerticalAlignment="Center" Margin="15,4,5,4"/>
					                             
    										<Image Margin="8,4,8,8" Width="72" Height="72" Source="{Binding CurrentProduct.ImageUri, Converter={StaticResource StringToImageConverter}, Mode=TwoWay}"/>
    									</Grid>
    								</Grid>
    							</Border>
    						</ControlTemplate>
    					</Setter.Value>
    				</Setter>
    			</Style>
    		</Odyssey_Controls:OdcListBox.ItemContainerStyle>
					
					
    	</Odyssey_Controls:OdcListBox>
    </Grid>
</UserControl>
